<template>
  <div>
    <div v-if="!isEdit" @click="handleEdit">修改</div>
    <div v-else @click="handleSave">保存</div>
  </div>

  <div>
    <div>发生时间：</div>
    <div v-if="!isEdit">
      {{ formData.eventTime }}
    </div>
    <div v-else>
      <a-date-picker
        v-model="formData.eventTime"
        type="date"
        placeholder="选择日期"
      />
    </div>
  </div>

  <div>
    <div>发生地点</div>

    <div v-if="!isEdit">
      {{ formData.eventLocation }}
    </div>
    <a-row :gutter="16" v-else>
      <a-col :span="20">
        <div v-if="formData.areatType == 1"></div>
      </a-col>
      <a-col :span="4">
        <a-select v-model="formData.areatType" placeholder="请选择地区类型">
          <a-select-option value="1">省</a-select-option>
          <a-select-option value="2">市</a-select-option>
          <a-select-option value="3">区</a-select-option>
        </a-select>
      </a-col>
    </a-row>
  </div>

  <div>
   <div v-for="item in affiliatesTabList" :key="item.name">
    <div>{{item.name}}</div>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref, watch } from "vue";
const isEdit = ref(false);
const formData = ref<{
  eventTime: Date | null;
  areatType: number | null;
  eventLocation: string | null;
}>({
  eventTime: null,
  areatType: null,
  eventLocation: null,
});
const longitude = [29.929774, 121.961776]
const handleEdit = () => {
  isEdit.value = true;
};
function toTimestamp(val) {
  if (!val) return null;
  const date = new Date(val);
  return isNaN(date.getTime()) ? null : date.getTime();
}

const handleSave = () => {
  formData.value.eventTime = toTimestamp(formData.value.eventTime);
  isEdit.value = false;
};

const affTabClick = (tab) => {
    if(tab.name == '航拍图'){
        window.cesiumMap.viewer.camera.flyTo({
            destination: new Cesium.Cartesian3.fromDegrees(longitude[0], longitude[1], 1000),
            orientation: {
                heading: Cesium.Math.toRadians(13.45),
                pitch: Cesium.Math.toRadians(-50),
                roll: Cesium.Math.toRadians(0)
            }
        });
    }
}

const companyId = ref(null);
const pointInfo = ref(null);
const affiliatesTabList = ref([
          {name: '航拍图'},
          {name: '作战图'},
          {name: '企业详情'}
        ]);
async function getCompanyInfo(id){
  return new Promise((resolve, reject) => {
    getCompanyInfo(id).then(res => {
      resolve(res);
    })
  })
}

watch(() => companyId.value, (val) => {
  if(val){
    getCompanyInfo(val).then(res => {
      let temp = res.filter(item => item.longitude_latitude && item.longitude_latitude.length > 0)[0]?.longitude_latitude;
      pointInfo.value = JSON.parse(temp);
      if(pointInfo.value){
        affiliatesTabList.value = [
          {name: '航拍图'},
          {name: '作战图'},
          {name: '企业详情'}
        ]
      }else {
        affiliatesTabList.value = [
          {name: '企业详情'}
        ]
      }
    })
  }
})
</script>

<style></style>
